<link rel="stylesheet" href="${contextPath}/plugins/highlightjs/hljs9.12.0.monokai-sublime.min.css"> 
<!-- <link rel="stylesheet" href="${contextPath}/plugins/highlightjs/hljs9.12.0.default.min.css"> -->
<link rel="stylesheet" href="${contextPath}/plugins/select2/4.0.2/select2.min.css">
<div class="row tab-content-row" id="gen_obj_guide_DIV">
  <div class="col-md-12">
      <div class="box box-primary">
        <div class="box-header">
          <h3 class="box-title">生成器(基于元对象)</h3>
          <div class="box-tools pull-right">
            <form class="form-inline">
            <div class="btn-group" >
                <button type="button" class="btn  btn-success btn-sm" data-btntype="history">历史记录</button>
                <button type="button" class="btn  btn-warning btn-sm" data-btntype="edit" data-position="tool">生成</button>
            </div>
            </form>
          </div>
        </div>
        <!-- /.box-header -->
        <form class="" id="" role="form"  >
        <div class="box-body table-responsive  ">
            <div class="form-group ">
              <div class="col-md-2"> 
                <div class="box box-solid">
                  <div class="box-header with-border">
                    <h3 class="box-title">对象列表</h3>

                    <div class="box-tools">
                      <button type="button" class="btn btn-box-tool" data-widget="collapse"><i class="fa fa-cloud-download"></i>
                      </button>
                      <button type="button" class="btn btn-box-tool" data-widget="collapse"><i class="fa fa-minus"></i>
                      </button>
                    </div>
                  </div>
                  <div class="box-body " id="selected_objs_box">
                    <ul class="nav nav-pills nav-stacked">
                      <li  data-objid="64"><a href="#" class="" >User
                        <span class="label label-primary pull-right"><i class="fa fa-cog"></i>配置</span>
                        </a>
                      </li>
                      <li data-objid="65"><a href="#" class="" >Org
                        <span class="label label-primary pull-right" ><i class="fa fa-cog"></i>配置</span>
                        </a>
                      </li>
                      <li data-objid="66"><a href="#" class="" >Role
                        <span class="label label-primary pull-right"><i class="fa fa-cog"></i>配置</span>
                        </a>
                      </li>
                    </ul>
                  </div>
                  <!-- /.box-body -->
                </div>
                
              </div>
              <div class="col-md-10">
                <div class="nav-tabs-custom" style="min-height: 300px;">
                  <ul class="nav nav-tabs pull-right" id="gen_tab">
                    <li><a href="#html_tab" data-toggle="tab"  url="">html</a></li>
                    <li><a href="#controller_tab" data-toggle="tab"  url="${contextPath}/gen/g2preViewController">Controller</a></li>
                    <li><a href="#serviceimpl_tab" data-toggle="tab" url="${contextPath}/gen/g2preViewServiceImpl">ServiceImpl</a></li>
                    <li><a href="#isiervice_tab" data-toggle="tab"  url="${contextPath}/gen/g2preViewIService">IService</a></li>
                    <li><a href="#dao_tab" data-toggle="tab"  url="${contextPath}/gen/g2preViewDAO">DAO</a></li>
                    <li><a href="#mapper_tab" data-toggle="tab"  url="${contextPath}/gen/g2preViewMapper">Mapper</a></li>
                    <li ><a href="#table_tab" data-toggle="tab"  url="${contextPath}/gen/g2preViewTable">Table</a></li>
                    <li ><a href="#entity_tab" data-toggle="tab"  url="${contextPath}/gen/g2preViewEntity">Entity</a></li>
                    <li class="dropdown">
                      <a class="dropdown-toggle" data-toggle="dropdown" href="#">
                        配置 <span class="caret"></span>
                      </a>
                      <ul class="dropdown-menu">
                        <li role="presentation"><a role="menuitem" tabindex="-1" id="pConfig" data-configid="" href="#">项目级配置</a></li>
                        <li role="presentation"><a role="menuitem" tabindex="-1" id="mConfig" data-configid="" href="#">模块级配置</a></li>
                        <li role="presentation"><a role="menuitem" tabindex="-1" id="oConfig" data-configid="" href="#">对象级配置</a></li>
                        <li role="presentation"><a role="menuitem" tabindex="-1" id="aConfig" data-configid="" href="#">属性级配置</a></li>
                        <li role="presentation" class="divider"></li>
                        <li role="presentation"><a role="menuitem" tabindex="-1" href="#">数据库配置</a></li>
                        <li role="presentation"><a role="menuitem" tabindex="-1" href="#">生成时配置</a></li>
                      </ul>
                    </li>
                    <li class="pull-left header"><i class="fa fa-th"></i> 产品系列</li>
                    
                    
                  </ul>
                  <div class="tab-content">
                    <div class="tab-pane active" id="entity_tab" >
                      
                      
                    </div>
                    <!-- /.tab-pane -->
                    <div class="tab-pane" id="table_tab">
                      
                    </div>
                    <div class="tab-pane" id="mapper_tab">
                      
                      
                    </div>
                    <!-- /.tab-pane -->
                    <div class="tab-pane" id="dao_tab">
                     
                    </div>
                    <!-- /.tab-pane -->
                    <div class="tab-pane" id="isiervice_tab">
                      
                      
                    </div>
                    <!-- /.tab-pane -->
                    <div class="tab-pane" id="serviceimpl_tab">
                      Lorem Ipsum is simply dummy text of the printing and typesetting industry.
                      
                    </div>
                    <!-- /.tab-pane -->
                    <div class="tab-pane" id="controller_tab">
                      Lorem Ipsum is simply dummy text of the printing and typesetting industry.
                      
                    </div>
                    <!-- /.tab-pane -->
                    <div class="tab-pane" id="html_tab">
                      Lorem Ipsum is simply dummy text of the printing and typesetting industry.
                      
                    </div>
                    <!-- /.tab-pane -->
                  </div>
                  <!-- /.tab-content -->
                </div>
              </div>
            </div>
              
            
            
          
        </div>
        </form>
        <!-- /.box-body -->
        <div class="box-footer box-footer-condensed clearfix">
          <button type="button" class="btn btn-primary" >生成</button>
          <button type="button" class="btn btn-default" >导出</button>
        </div>
          <!-- /.box-footer -->
      </div>
      <!-- /.box -->
  </div>
  <!-- /.col-md-12 -->
  
  
</div>



<script>
require(["jquery","bootbox","hljs","bootstrap", "bootstrapTable","bootstrapTab_CH","validate","framework"],function($,bootbox,hljs) {
  var container = $("#gen_obj_guide_DIV");
 

  function previewCode(){

  }

  function showTabs(targetSelector,url,entityId,pConfigId,mConfigId,oConfigId,aConfigId){
    //Long objId,Long pConfigId,Long mConfigId,Long oConfigId,Long aConfigId
    $(targetSelector).load(url,{"objId":entityId,"pConfigId":pConfigId,"mConfigId":mConfigId,"oConfigId":oConfigId,"aConfigId":aConfigId});

  }
  container.find('#selected_objs_box li').on('click',function(){
    container.find('#selected_objs_box li').removeClass("active");
    $(this).addClass("active");
    var currentTabA = container.find("#gen_tab li[class='active'] a");
    tabLoad(currentTabA.attr("href"),currentTabA.attr("url"))
    
  })

  container.find('a[data-toggle="tab"]').on('show.bs.tab', function (e) {
    var targetSelector = $(e.target).attr('href');
    var url = $(e.target).attr('url');
    tabLoad(targetSelector,url);
  })
  function tabLoad(targetSelector,url){
    var entityId;
    $.each(container.find('#selected_objs_box li[class="active"]'),function(index,obj){
      entityId = $(obj).data('objid');   
    });
    if(entityId){
      var pConfigId = container.find('#pConfig').data('configid');
      var mConfigId = container.find('#mConfig').data('configid');
      var oConfigId = container.find('#oConfig').data('configid');
      var aConfigId = container.find('#aConfig').data('configid');
      if(url){
        $(targetSelector).load(url,{"objId":entityId,"pConfigId":pConfigId,"mConfigId":mConfigId,"oConfigId":oConfigId,"aConfigId":aConfigId});
      }
    }
  }
  // container.on('click','a[data-toggle="#tab"]',function(e) {
  //     debugger
  //   if((e.currentTarget).attr('url') && ("" != (e.currentTarget).attr('url') )){
  //     var entityId;
  //     $.each(container.find('#selected_objs_box .selected_obj'),function(index,obj){
  //       entityId = obj.data('objid');   
  //     });
  //     var pConfigId = container.find('#pConfig').data('configid');
  //     var mConfigId = container.find('#mConfig').data('configid');
  //     var oConfigId = container.find('#oConfig').data('configid');
  //     var aConfigId = container.find('#aConfig').data('configid');
  //     showTabs($(e.currentTarget).attr('href'),(e.currentTarget).attr('url'),entityId,pConfigId,mConfigId,oConfigId,aConfigId);
  //     e.preventDefault();
  //   }
    
  // });
  // container.find('pre code').each(function(i, block) {
  //   hljs.highlightBlock(block);
  // });

    
    
});
</script>